<template>
	<view>
		<view class="cu-bar search bg-white searchs">
			<view class="search-form round">
				<text class="cuIcon-search"></text>
				<input :adjust-position="false" type="text" placeholder="搜索" confirm-type="search"></input>
			</view>
		<!-- 	<view class="action">
				<button class="cu-btn bg-green shadow-blur round">搜索</button>
			</view> -->
		</view>
		<view>
			<view class="menus" v-for="(item, index) in addList" :key="index" @click="qunliao(item.type,item.group_id,item.name)">
				<img :src="item.avatar || '../../static/image/bg_img.png'" alt="">
				<view class="item-name">{{item.name}}</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				addList : []
			}
		},
		onLoad(){
			this.initDat();
		},
		onShow(){
			this.$msgchat.initwork();
			this.initDat();
		},
		methods: {
			//初始化数据
			initDat(){
				this.$common.requests('/api/index/getmygroup').then(res => {
					// for(var i=0;i < res.data.data.length;i++ ){
					// 	res.data.data[i].people.avatar =  this.$common.baseUrl + res.data.data[i].people.avatar;
					// }
					res.data.data.forEach((item, index) =>{
						item.avatar = this.$common.baseUrl + item.avatar;
					})
					this.addList = res.data.data;
				})
			},
			fanhui(){
				uni.switchTab({
					url: '../index/index'
				})
			},
			add(){
				uni.navigateTo({
					url: '../buildGroup/buildGroup'
				});
			},
			//群聊天页面
			qunliao(type,group_id,name){
				uni.navigateTo({
					url: '../HM-chat/HM-chats?type='+type+'&group_id='+group_id+'&nickname='+name
				});
			}
		}
	}
</script>

<style lang="scss" >
	.header{
		width: 100%;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 99;
		background: #F8F8F8;
		padding-top: 40upx;
	}
	.round{
		border-radius: 14upx;
		background: #fff!important;
	}
	.searchs{
		padding: 10upx 0 10upx 0;
		background: $uni-color-bei;
	}
	.item-name{
		color: $uni-text-color;
		font-weight: bold;
		margin-left: 20upx;
		overflow: hidden;
		text-overflow:ellipsis;
		white-space: nowrap;
	}
	.add{
		width: 40upx;
		height: 40upx;
		margin: 0 4%;
	}
	.menus{
		width: 92%;
		margin: 0 auto;
		border-bottom: solid 2upx #EEEEEE;
		padding: 15upx 0;
		display: flex;
		justify-content: flex-start;
		align-items: center;
	}
	.menus>img:nth-child(1){
		width: 80upx;
		height: 80upx;
		border-radius: 10upx;
	}
	.menus>view:nth-child(2){
		font-size: 30upx;
		width: 65%;
	}
	.menus>img:nth-child(3){
		width: 30upx;
		height: 30upx;
	}
	.btns{
		padding: 9upx 15upx;
		color: #39B54A;
		border-radius: 10upx;
		border: 1px solid #39B54A;
	}
	.btns1{
		font-size: 28upx;
		color: #C0C0C0;
	}
</style>
